<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>购物车</title>
  <link rel="stylesheet" href="./css/common.css">
  <link rel="stylesheet" href="./css/reset.css">
  <link rel="stylesheet" href="./css/cart.css">
</head>

<body>
  <!-- 头部区域 -->
  <header id="header">
    <!-- 顶部 -->
    <div class="top">
      <div class="container">
        <p class="leftbox fl">乐购www.legou.com</p>
        <p class="rightbox fr">
          <span>欢迎光临乐购</span> 请
          <a href="./login.html" class="ff9c0"> 登录</a>
          <span class="ff9c0 mlr10">|</span>
          <a href="./register.html" class="ff9c0">注册</a>
        </p>
      </div>
    </div>
    <!-- 底部 -->
    <div class="container btm clearfix mtb14">
      <a href="./index.html" class="logo fl">
        <img src="./images/2015_logo.png">
      </a>
      <!-- 右边的大盒子 -->
      <div class="rightbox fr">
        <div class="topbox clearfix mtb10">
          <form action="#" class="fl">
            <input type="text" class="search fl" placeholder="请输入搜索的商品名">
            <input type="button" class="submitbtn fl">
          </form>
          <a href="./shopcart.html" class="shopping-cart fl mlr30">
            <strong>购物车</strong>
            <span>0</span>
          </a>
          <a href="#" class="order fl">我的订单</a>
        </div>
        <!-- 导航 -->
        <ul class="nav clearfix mt20">
          <li>
            <a href="#">图书</a>
          </li>
          <li>
            <a href="#">电子书</a>
          </li>
          <li>
            <a href="#">原创文学</a>
          </li>
          <li>
            <a href="#">服装</a>
          </li>
          <li>
            <a href="#">运动户外</a>
          </li>
          <li>
            <a href="#">孕婴童</a>
          </li>
          <li>
            <a href="#">家居</a>
          </li>
          <li>
            <a href="#">创意文具</a>
          </li>
          <li>
            <a href="#">地方特产</a>
          </li>
          <li>
            <a href="#">海外购</a>
          </li>
          <li>
            <a href="#">电器城</a>
          </li>

        </ul>
      </div>
    </div>
  </header>
  <div id="main" class="ptb45">
    <div class="header container bdfff">
      <div class="title clearfix">
        <ul class="u1 fl">
          <li>
            <span class="font18 mlr10">全部商品</span>
            <span class="fw colorred font18">2</span>
          </li>
          <li>
            <span class="font18 mlr10">活动商品</span>
            <span class="fw colorred font18">0</span>
          </li>
          <li>
            <span class="font18 mlr10">库存紧张</span>
            <span class="fw colorred font18">0</span>
          </li>
        </ul>
        <ul class="u2 fr">
          <li>
            <span class="fw">温馨提示:</span>
            <span>亲爱的顾客, 您还没有登录, 所有商品价格,活动信息以登录后显示为准</span>
          </li>
          <li>
            <button class="font12 colorfff mlr10">立即登录</button>
          </li>
        </ul>
      </div>
      <ul class="list_header">
        <li class="list_chk">
          <!-- <input type="checkbox" id="selall"> -->
          <div class="shop_info">
            <!-- 单个店铺的全选 -->
            <input type="checkbox" class="all_check ">
          </div>
        </li>
        <li class="list_con">商品信息</li>
        <li class="list_info">商品参数</li>
        <li class="list_price">单价</li>
        <li class="list_amount">数量</li>
        <li class="list_sum">金额</li>
        <li class="list_op">操作</li>
      </ul>
      <!-- 第一个店铺 -->
      <div class="cartbox">
        <!-- 店铺信息 -->
        <p class="shop">
          <span>木果果木官方旗舰店</span>
          <span class="bdg">联系店家</span>
          <span class="colorred">满两件包邮</span>
        </p>

        <!-- 订单主要区域 -->
        <div class="order_content">
          <ul class="order_lists mt10 clearfix">
            <li class="list_chk">
              <!-- 单个复选框 -->
              <input type="checkbox" class="son_check">
            </li>
            <li class="list_con">
              <div class="list_img fl">
                <a href="javascript:;">
                  <img src="./images/1.jpg" alt="">
                </a>
              </div>
              <div class="list_text fl">
                <a href="#">木果果木2016秋装新品韩范简约宽松中长款纯棉长袖衬衫</a>
                <br>
                <span class="font12 colorfff fl">新品</span>
                <span class="font12 colorfff fl">包邮</span>
              </div>
            </li>
            <li class="list_info">
              <p>规格：默认</p>
              <p>尺寸：16*16*3(cm)</p>
            </li>
            <li class="list_price">
              <p class="price">￥
                <span>500</span>
              </p>
            </li>
            <li class="list_amount">
              <div class="amount_box">
                <!-- 减 -->
                <a class="reduce fl">-</a>
                <input type="text" value="1" class="sum fl">
                <!--  加 -->
                <a class="plus fl">+</a>
              </div>
            </li>
            <li class="list_sum">
              <!-- 小计结果 -->
              <p class="sum_price">￥
                <span>500</span>
              </p>
            </li>
            <li class="list_op">
              <p class="del">
                <a class="delbtn">移除商品</a>
              </p>
            </li>
          </ul>
          <ul class="order_lists mt10 clearfix">
            <li class="list_chk">
              <!-- 单个复选框 -->
              <input type="checkbox" class="son_check">
            </li>
            <li class="list_con">
              <div class="list_img fl">
                <a href="javascript:;">
                  <img src="./images/1.jpg" alt="">
                </a>
              </div>
              <div class="list_text fl">
                <a href="#">木果果木2016秋装新品韩范简约宽松中长款纯棉长袖衬衫</a>
                <br>
                <span class="font12 colorfff fl">新品</span>
                <span class="font12 colorfff fl">包邮</span>
              </div>
            </li>
            <li class="list_info">
              <p>规格：默认</p>
              <p>尺寸：16*16*3(cm)</p>
            </li>
            <li class="list_price">
              <p class="price">￥
                <span>500</span>
              </p>
            </li>
            <li class="list_amount">
              <div class="amount_box">
                <!-- 减 -->
                <a class="reduce fl">-</a>
                <input type="text" value="1" class="sum fl">
                <!--  加 -->
                <a class="plus fl">+</a>
              </div>
            </li>
            <li class="list_sum">
              <!-- 小计结果 -->
              <p class="sum_price">￥
                <span>500</span>
              </p>
            </li>
            <li class="list_op">
              <p class="del">
                <a class="delbtn">移除商品</a>
              </p>
            </li>
          </ul>

        </div>
      </div>
      <!-- 第二个店铺 -->


      <!-- 底部 -->
      <div class="btmbox">

        <!-- <input type="checkbox" class="all_check ml30">
              <span>全选</span>  -->
        <a class="delallsel">删除选中商品</a>
        <p class="fr">
          <span>已选择
            <strong class="cf40 amount">0</strong>件商品</span>
          <span>共计
            <strong class="cf40 totalprice">0.00</strong>元</span>
          <a href="#" class="colorfff">去结算</a>
        </p>


      </div>
    </div>
    <div class="lovely clearfix container bdfff">
      <div class="title">
        <p class="font18">猜你喜欢</p>
      </div>
      <div class="case case1 fl mtb14">
        <img src="./images/lovely.jpg">
        <p class="font16 mtb10">AIVEI秋新中长款牛仔</p>
        <p>¥ 79.00</p>
      </div>
      <div class="case case2 fl mtb14">
        <img src="./images/lovely.jpg">
        <p class="font16 mtb10">AIVEI秋新中长款牛仔</p>
        <p>¥ 79.00</p>
      </div>
      <div class="case case3 fl mtb14">
        <img src="./images/lovely.jpg">
        <p class="font16 mtb10">AIVEI秋新中长款牛仔</p>
        <p>¥ 79.00</p>
      </div>
      <div class="case case4 fl mtb14">
        <img src="./images/lovely.jpg">
        <p class="font16 mtb10">AIVEI秋新中长款牛仔</p>
        <p>¥ 79.00</p>
      </div>
      <div class="case case5 fl mtb14">
        <img src="./images/lovely.jpg">
        <p class="font16 mtb10">AIVEI秋新中长款牛仔</p>
        <p>¥ 79.00</p>
      </div>
      <div class="case case6 fl mtb14">
        <img src="./images/lovely.jpg">
        <p class="font16 mtb10">AIVEI秋新中长款牛仔</p>
        <p>¥ 79.00</p>
      </div>
    </div>
  </div>

  <div id="footer" class="bdfff">
    <div class="container">
      <div class="promise clearfix">
        <div class="case case1 fl">
          <img class="fl mb15" src="./images/CgQI0lWskgmADBnsAAAPZvcSh3E68900~1.jpg">
          <ul class="fl mb15">
            <li>
              <p class="font20 fw">正品保障</p>
            </li>
            <li class="mb10">
              <p class="colorccc">正品行货 放心选购</p>
            </li>
          </ul>
        </div>
        <div class="case case2 fl">
          <img class="fl mb15" src="./images/ChEbulWsk4iADa_aAAAM544hHN818600~1.jpg">
          <ul class="fl mb15">
            <li>
              <p class="font20 fw">满86包邮</p>
            </li>
            <li class="mb10">
              <p class="colorccc">满86元 免运费</p>
            </li>
          </ul>
        </div>
        <div class="case case3 fl">
          <img class="fl mb15" src="./images/CgQIz1WslI-Adao3AAAN5b_ut2I80100~1.jpg">
          <ul class="fl mb15">
            <li>
              <p class="font20 fw">售后无忧</p>
            </li>
            <li class="mb10">
              <p class="colorccc">7天无理由退货</p>
            </li>
          </ul>
        </div>
        <div class="case case4 fl">
          <img class="fl mb15" src="./images/ChEi11WsyiyALBbiAAAN9lEEK5M33200~1.jpg">
          <ul class="fl mb15">
            <li>
              <p class="font20">准时送达</p>
            </li>
            <li class="mb10">
              <p class="colorccc">收货时间由你做主</p>
            </li>
          </ul>
        </div>
      </div>
      <div class="other clearfix">
        <div class="ul1 ul fl mlr10">
          <p class="font18 fw mtb10">新手入门</p>
          <ul>
            <li class="colorccc">
              <a>购物流程</a>
            </li>
            <li class="colorccc">
              <a>会员制度</a>
            </li>
            <li class="colorccc">
              <a>订单查询</a>
            </li>
            <li class="colorccc">
              <a>服务协议及隐私说明</a>
            </li>
            <li class="colorccc">
              <a>网站地图</a>
            </li>
          </ul>
        </div>
        <div class="ul2 ul fl mlr30">
          <p class="font18 fw mtb10">支付方式</p>
          <ul>
            <li class="colorccc">
              <a>货到付款</a>
            </li>
            <li class="colorccc">
              <a>网上支付</a>
            </li>
            <li class="colorccc">
              <a>礼品卡支付</a>
            </li>
            <li class="colorccc">
              <a>其他支付</a>
            </li>
          </ul>
        </div>
        <div class="ul3 ul fl mlr30">
          <p class="font18 fw mtb10">
            配送服务
          </p>
          <ul>
            <li class="colorccc">
              <a>配送进度查询</a>
            </li>
            <li class="colorccc">
              <a>商品验货与签收</a>
            </li>
          </ul>
        </div>
        <div class="ul4 ul fl mlr30">
          <p class="font18 fw mtb10">相关规则</p>
          <ul>
            <li class="colorccc">
              <a>平台规则</a>
            </li>
            <li class="colorccc">
              <a>退换货政策</a>
            </li>
            <li class="colorccc">
              <a>发票制度</a>
            </li>
            <li class="colorccc">
              <a>帮助中心</a>
            </li>
          </ul>
        </div>
        <div class="ewm1 fl ewm mlr30">
          <p class="fw mtb10">App更优惠</p>
          <img src="./images/qryhd.png">
        </div>
        <div class="ewm2 fl ewm mlr30">
          <p class="fw mtb10">加微信查订单</p>
          <img src="./images/qryhd.png">
        </div>
      </div>
    </div>
  </div>
  <div id="bottom" class="bdccc">
    <div class="container">
      <p class="colorccc mtb10">沪ICP备XXXXXXXXX号 | 经营证照 | 互联网药品信息服务资格证(沪)-经营性-2017-0006 | 违法和不良信息举报电话：XXX-XXXXXXXX | 沪B2-XXXXXXX | </p>
      <p class="colorccc">沪公网安备 XXXXXXXXX号 | 友情链接 | 出版物经营许可证 | 增值电信业务经营许可证</p>
      <div class="logo clearfix mtb10">
        <img src="./images/7b46518a9d74a1d6.jpg" class="fl">
        <img src="./images/CgQCr1PQy1CAF7vaAABDexsiEYM24800.jpg" class="fl">
        <img src="./images/CgQCrlPYTqCASlHXAAAd82JE0eA31000.png" class="fl">
        <img src="./images/ChEi1FYXHcOAVk_WAAAL2r2-yfo10200.jpg" class="fl">
        <img src="./images/ChEi2lh171KAJrGlAAALl_uZt0E75600.jpg" class="fl">
        <img src="./images/f582260777c44b30.png" class="fl">
      </div>
    </div>
  </div>
  <script src="./lib/jquery.js"></script>
  <script src="./js/cart.js"></script>
</body>

</html>